import EventMgr from "@/core/EventMgr";
import PlayGroundCanvas, { currentGridInfo } from "./backgroundCanvas";
import {ToolBarInfos} from "../toolBar/toolBar"
export function registryDropEvent(
    this:PlayGroundCanvas,
    targetElement: HTMLElement){
        const evtMgr = new EventMgr(targetElement);
        const self = this;
        evtMgr.addEventListener("dragover",function(ev){
            ev.preventDefault();
        });
        evtMgr.addEventListener("drop",function(this:HTMLElement,ev){

            var data=(<DragEvent>ev).dataTransfer?.getData("Text");
            const target = document.createElement("div");
            const result = ToolBarInfos.get(data||"");
            ToolBarInfos.delete(data||"")
            if(result){
                result.left = Math.round((<DragEvent>ev).offsetX/currentGridInfo.gridWidth);
                result.top = Math.round((<DragEvent>ev).offsetY/currentGridInfo.gridHeight);
                self.createStructByDrop(result);
            }
            target.setAttribute("innerHTML",data||"");
            this.appendChild(target);
            ev.preventDefault();
        });

        // 暂时不考虑画布动态
        // window.addEventListener("resize",function(){
        //     self.playgroundWidth = self.container.offsetWidth;
        //     self.playgroundHeight = self.container.offsetHeight;
        //     const gridWidth = self.container.offsetWidth / 24;
        //     const gridHeight = self.container.offsetHeight / 24;

        //     self.canvasElement.setAttribute("width", self.container.offsetWidth + 'px');
        //     self.canvasElement.setAttribute("height", self.container.offsetHeight + 'px');

        //     self.girdLayer.setAttribute("width", self.playgroundWidth + 'px');
        //     self.girdLayer.setAttribute("height", self.playgroundHeight + 'px');

        //     self.shadowLayer.setAttribute("width", self.playgroundWidth + 'px');
        //     self.shadowLayer.setAttribute("height", self.playgroundHeight + 'px');
        //     currentGridInfo = {
        //         gridWidth,
        //         gridHeight
        //     }

        //     self.canvasContext?.clearRect(0, 0, self.container.offsetWidth, self.container.offsetHeight);
        //     self.draw();
        //     ElementLocationSizeMap.forEach((ElmenetLocationSize,element,map)=>{
        //         element.style.width = ElmenetLocationSize.width*gridWidth+"px";
        //         element.style.height = ElmenetLocationSize.top*gridHeight+"px";
        //         element.style.top = ElmenetLocationSize.top*gridHeight+"px";
        //         element.style.left = ElmenetLocationSize.left*gridWidth+"px";
        //     });
        // },false);
}